<template>
  <div id="box">
    <div id="zhuce">
    <div>
      <span class="top">注册</span>
      <router-link to="/denglu"><span>已有账号，前往登录</span></router-link>
    </div>
       <div>
       账号：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" placeholder="手机号/QQ号/微信号">
     </div>
      <div>
       密码：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="password" placeholder="6-8位密码，数字和字母结合">  
      </div>
      <div>
       确认密码：<input type="password" placeholder="请确认密码">  
      </div>
      <div><button>点击注册</button></div>

  </div>
  </div>
</template>

<script>
export default {

}
</script>
<style scoped>
#box{
  display: flex;
   height: 6.67rem;
  align-items: center;
}
#zhuce{
     width: 2.5rem;
    height: 2.5rem;
    padding: .5rem 0;
    background-image: url("../../public/img/111.jpg");
    margin: 0 auto;
    text-align: center; 
    border-radius: .3rem;
  }
  input{
     height: .3rem;
     margin-bottom: .15rem;
  }
#zhuce div:nth-child(1){
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  margin-bottom: .2rem;

}
 .top{
   font-weight: 600;
    font-size: .2rem;
     line-height: .4rem;
     color: red;
     margin-left: 1rem;
}
a{
   line-height: .4rem;
}
button{
    height: .4rem;
    width: 0.6rem;
    border-radius: .15rem;
    color: white;
    background-color: coral;
    border: none;
  }
</style>